<template>
  <div class="type-container">
    <div class="title-container">
      <h1 class="title">
        类型管理
      </h1>
    </div>
     <el-button
        class="filter-item"
        type="primary"
        icon="el-icon-edit"
        @click="handleCreate"
        style="margin-left:20px"
    >新建</el-button>
    <from-table 
        :tablekey="tablekey"
        :listLoading="listLoading"
        :list="list"
        @handleUpdate="handleUpdate"
        @handleDelete="handleDelete"
      />
    <from-dialog
      
    ></form-dialog>  
  </div>
</template>

<script>
import table  from '@/components/board/Type/Table'
import dialog from '@/components/board/Type/Dialog'
import TypeService from '@/service/type'

const typeService = new TypeService();

export default {
  name:'Type',
  components:{
    FromTable:table,
    FromDialog:dialog
  },
  data(){
    return{
      tablekey:1,
      listLoading:false,
      list:[]
    }
  },
  created(){
    this.initInfo();
  },
  methods:{
    async initInfo(){
      this.list = await typeService.findType();
    },
    handleCreate(){

    },
    handleUpdate(row){

    },
    handleDelete(row,index){
      let id = row.id;
      typeService.destroyType({id}).then(()=>{
        this.list.splice(index,1);
      })
    }
  }

}
</script>

<style scoped>
  .title-container{
    width: 100%;
    padding: 20px;
    font-weight:500;
  }
  .title{
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e5e5;
  }
  .type-container{
    height: 100%;
    overflow: auto;
  }

</style>